<template>
  <el-input
    class="cz-input-number"
    v-bind="$attrs"
    v-on="$listeners"
    :value="num"
  >
    <!-- 如果需要传递的slot不固定或者较多，我们可以通过动态插槽名称透传 -->
    <template v-for="(slot, slotName) in $slots" #[slotName]>
      <slot :name="slotName" />
    </template>
  </el-input>
</template>

<script>
export default {
  name: "CzInputNumber",
  props: {
    value: [String, Number],
  },
  computed: {
    num() {
      return typeof this.value === "string" ? this.value : "插槽";
    },
  },
};
</script>

<style lang="less" scoped>
.cz-input-number {
  ::v-deep .el-input__inner {
    text-align: left;
  }
}
</style>